<template>
  <view class="page flex-col">
    <view class="section_1 flex-col">
      <view class="image-text_9 flex-col">
        <image class="box_1 flex-col" src="@/static/logo.png"></image>
        <text class="text-group_1">
          伏羲东方
          <br />
          数字化智慧云平台
        </text>
      </view>
      <view class="box_5 flex-col">
        <view class="image-text_2 flex-row justify-between align-center">
          <image
            class="label_1"
            referrerpolicy="no-referrer"
            src="./imgs/avatar.png"
          />
          <input
            class="text-group_2"
            type="text"
            v-model="user_name"
            placeholder="请输入账号/手机号"
          />
        </view>
        <view class="image-text_3 flex-row justify-between align-center">
          <image
            class="label_2"
            referrerpolicy="no-referrer"
            src="./imgs/pwd.png"
          />
          <input
            class="text-group_3"
            type="password"
            v-model="password"
            placeholder="请输入登录密码"
          />
        </view>
        <view class="group_3 flex-row justify-between">
          <view class="image-text_10 flex-row justify-between align-center">
            <image
              class="label_3"
              referrerpolicy="no-referrer"
              src="./imgs/code.png"
            />
            <input
              class="text-group_4"
              type="text"
              maxlength="4"
              v-model="captcha"
              placeholder="请输入验证码"
            />
          </view>
          <view class="group_2 flex-col" @click="changeGif">
            <image class="gif-img" :src="gifImg" />
          </view>
        </view>
      </view>
      <view class="text-wrapper_2 flex-col" @click="handleLogin">
        <text class="text_5">立即登录</text>
      </view>
      <view class="image-text_11 flex-row justify-between" @click="gotoQrcode">
        <image
          class="thumbnail_3"
          referrerpolicy="no-referrer"
          src="./imgs/wechat.png"
        />
        <text class="text-group_5">微信扫码</text>
      </view>
    </view>
  </view>
</template>
<script>
import { computed } from "vue";
import { baseUrl } from "../../config";
export default {
  data() {
    return {
      constants: {},
      timestamp: new Date().getTime(),
      baseUrl: baseUrl,
      gifImg: computed(
        () => baseUrl + "/api/User/GifHybridCode?timestamp=" + this.timestamp
      ),
      user_name: "",
      password: "",
      captcha: "",
    };
  },
  async onLoad() {
    const pages = getCurrentPages();
    const lastPage = pages[pages.length -2];
    console.log(lastPage);
    if(lastPage){
      uni.setStorageSync("lastPage", lastPage.$page.fullPath);
    }
  },
  methods: {
    changeGif() {
      this.timestamp = new Date().getTime();
    },
    async handleLogin() {
      if (!this.user_name) {
        uni.showToast({
          title: "请输入账号/手机号",
          icon: "none",
        });
        return;
      }
      if (!this.password) {
        uni.showToast({
          title: "请输入登录密码",
          icon: "none",
        });
        return;
      }
      if (!this.captcha) {
        uni.showToast({
          title: "请输入验证码",
          icon: "none",
        });
        return;
      }
	  try{
		  let param = {
		    timestamp: this.timestamp,
		    user_name: this.user_name,
		    password: this.password,
		    captcha: this.captcha,
		  };
		  let res = await this.API.Login(param);
		   this.changeGif()
		  if (res&&res.accessToken) {
		    //成功
		    uni.setStorageSync("token", res.accessToken);
		    let myProfile = await this.API.MyProfile();
		    let lastPage = uni.getStorageSync("lastPage")
		  		console.log(111,lastPage)
		  		if(lastPage && lastPage!=='/pages/login/login'){
		  			uni.navigateTo({ url:lastPage });
		  		}
		  		
		    if (myProfile.user_type_id == 4) {
		      uni.setStorageSync("myProfile", myProfile);
		      uni.switchTab({
		        url: "/pages/index/index",
		      });
		    }
		    //老师
		    if (myProfile.user_type_id == 3) {
		      uni.setStorageSync("myProfile", myProfile);
		      uni.switchTab({
		        url: "/pages/teacher/index/index",
		      });
		    }
		  } else {
		    this.changeGif();
		  }
	  }catch{
		  this.changeGif()
	  }
      
    },
    gotoQrcode() {
      uni.navigateTo({
        url: "/pages/login/wxQrcode",
      });
    },
  },
};
</script>
<style lang="less" scoped>
.page {
  background-color: rgba(243, 244, 245, 1);
  position: relative;
  width: 750rpx;
  overflow: hidden;
  .section_1 {
    background: linear-gradient(180deg, #eff6ff 0%, #ffffff 100%);
    padding: 28rpx 28rpx 184rpx 42rpx;
    .box_4 {
      .text-wrapper_4 {
        width: 108rpx;
        height: 40rpx;
        overflow-wrap: break-word;
        font-size: 0;
        letter-spacing: -0.2800000011920929px;
        font-family: PingFangSC-Semibold;
        font-weight: 600;
        text-align: right;
        white-space: nowrap;
        line-height: 40rpx;
        .text_8 {
          overflow-wrap: break-word;
          color: rgba(255, 255, 255, 1);
          font-size: 28rpx;
          font-family: PingFangSC-Semibold;
          font-weight: 600;
          text-align: left;
          white-space: nowrap;
          line-height: 40rpx;
        }
        .text_9 {
          overflow-wrap: break-word;
          color: rgba(255, 255, 255, 1);
          font-size: 28rpx;
          font-family: PingFangSC-Semibold;
          font-weight: 600;
          text-align: left;
          white-space: nowrap;
          line-height: 40rpx;
        }
      }
      .thumbnail_6 {
        width: 34rpx;
        height: 22rpx;
        margin: 8rpx 0 10rpx 438rpx;
      }
      .thumbnail_7 {
        width: 30rpx;
        height: 22rpx;
        margin: 6rpx 0 12rpx 10rpx;
      }
      .image_3 {
        width: 50rpx;
        height: 24rpx;
        margin: 6rpx 0 10rpx 10rpx;
      }
    }
    .text_3 {
      overflow-wrap: break-word;
      color: rgba(38, 38, 38, 1);
      font-size: 36rpx;
      font-family: PingFangSC-Medium;
      font-weight: 500;
      text-align: left;
      white-space: nowrap;
      line-height: 52rpx;
      margin: 42rpx 312rpx 0 296rpx;
    }
    .image-text_9 {
      margin: 114rpx 202rpx 0 190rpx;
      .box_1 {
        width: 180rpx;
        height: 180rpx;
        margin: 0 56rpx 0 52rpx;
      }
      .text-group_1 {
        width: 288rpx;
        height: 88rpx;
        overflow-wrap: break-word;
        color: rgba(38, 38, 38, 1);
        font-size: 36rpx;
        font-family: PingFangSC-Medium;
        font-weight: 500;
        text-align: center;
        line-height: 44rpx;
        margin-top: 36rpx;
      }
    }
    .box_5 {
      margin: 72rpx 32rpx 0 18rpx;
      .image-text_2 {
        background-color: rgba(255, 255, 255, 1);
        border-radius: 8px;
        width: 630rpx;
        border: 1px solid rgba(230, 235, 241, 1);
        padding: 22rpx 240rpx 22rpx 30rpx;
        .label_1 {
          width: 60rpx;
          height: 60rpx;
        }
        .text-group_2 {
          overflow-wrap: break-word;
          color: #262626;
          font-size: 32rpx;
          font-weight: normal;
          text-align: left;
          white-space: nowrap;
          line-height: 44rpx;
          margin-top: 8rpx;
        }
      }
      .image-text_3 {
        background-color: rgba(255, 255, 255, 1);
        border-radius: 8px;
        width: 630rpx;
        border: 1px solid rgba(230, 235, 241, 1);
        margin-top: 48rpx;
        padding: 22rpx 288rpx 22rpx 30rpx;
        .label_2 {
          width: 60rpx;
          height: 60rpx;
        }
        .text-group_3 {
          overflow-wrap: break-word;
          color: #262626;
          font-size: 32rpx;
          font-weight: normal;
          text-align: left;
          white-space: nowrap;
          line-height: 44rpx;
          margin-top: 8rpx;
        }
      }
      .group_3 {
        background-color: rgba(255, 255, 255, 1);
        border-radius: 8px;
        width: 630rpx;
        border: 1px solid rgba(230, 235, 241, 1);
        margin-top: 48rpx;
        padding: 22rpx 22rpx 22rpx 22rpx;
        .image-text_10 {
          width: 268rpx;
          .label_3 {
            width: 60rpx;
            height: 60rpx;
          }
          .text-group_4 {
            overflow-wrap: break-word;
            color: #262626;
            font-size: 32rpx;
            font-weight: normal;
            text-align: left;
            white-space: nowrap;
            line-height: 44rpx;
            margin-top: 8rpx;
          }
        }
        .group_2 {
          background-color: rgba(216, 216, 216, 1);
          width: 180rpx;
          height: 64rpx;
          margin-left: 36rpx;
          .gif-img {
            width: 100%;
            height: 100%;
          }
        }
        .text_4 {
          overflow-wrap: break-word;
          color: rgba(39, 118, 255, 1);
          font-size: 28rpx;
          font-weight: normal;
          text-align: left;
          white-space: nowrap;
          line-height: 40rpx;
          margin-top: 10rpx;
        }
      }
    }
    .text-wrapper_2 {
      background-color: rgba(39, 118, 255, 1);
      border-radius: 8px;
      margin: 146rpx 32rpx 0 18rpx;
      padding: 32rpx 252rpx 32rpx 250rpx;
      .text_5 {
        overflow-wrap: break-word;
        color: rgba(255, 255, 255, 1);
        font-size: 32rpx;
        font-family: PingFangSC-Medium;
        font-weight: 500;
        text-align: left;
        white-space: nowrap;
        line-height: 44rpx;
      }
    }
    .image-text_11 {
      width: 176rpx;
      margin: 72rpx 256rpx 0 248rpx;
      .thumbnail_3 {
        width: 40rpx;
        height: 40rpx;
        margin-top: 2rpx;
      }
      .text-group_5 {
        overflow-wrap: break-word;
        color: rgba(38, 38, 38, 1);
        font-size: 32rpx;
        font-weight: normal;
        text-align: left;
        white-space: nowrap;
        line-height: 40rpx;
      }
    }
  }
}
</style>
